@import '../../../style/base.styl';
@import '/animate.styl';
.container
	padding 32rpx
	.title
		display flex
		align-items center
		font-size 34rpx
		font-family PingFangSC-Medium, PingFang SC;
		font-weight 500
		color #000
		padding 32rpx 0 26rpx
		&::before
			margin-right 8rpx
			content ''
			width 8rpx
			height 44rpx
			background $fontColor
	.progress-box
		overflow hidden
		height 28rpx
		border-radius 14rpx
		background-color #ebeef5
		display inline-flex
		align-items center
		width 100%
		&.stripe
		&.general
			& > view:first-child
				height 100%
				background-color #ff9800
		&.stripe
			& > view:first-child
				background-image linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent)
		&.proportion
			view
				height: 100%;
				align-items center
				display flex
				justify-items flex-end
				justify-content space-around
				font-size 20rpx
				color #fff
				transition width 0.6s ease
				background-image linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent)
				background-size 72rpx 72rpx
				animation progress-stripes 2s linear infinite
				-webkit-animation progress-stripes 2s linear infinite
				&:first-child
					background-color #0eaffe
				&:nth-child(2)
					background-color #FF3C48
				&:last-child
					background-color #0f7ea4
